<!DOCTYPE html>
<html lang="ko">
	<head>
		<meta charset="UTF-8" />
		<title>목록 태그</title>
	</head>
	<body>
		<h1>목록태그</h1>
		<h3>ABOUT US</h3>
		<ul style="list-style-type: square">
			<li>Company</li>
			<li>News</li>
			<li>Jobs</li>
			<li>Policies</li>
			<li>Contact</li>
		</ul>
		<h3>SOCIAL</h3>
		<ul style="list-style-type: disc">
			<li>Facebook</li>
			<li>Twitter</li>
			<li>Try our app</li>
		</ul>
		<h3>SERVICE</h3>
		<ul style="list-style-type: circle">
			<li>FAQ</li>
			<li>Live support</li>
			<li>Site map</li>
		</ul>
		<!--
			ul : unordered list 순서없는 목록
			목록의 각 항목은 li태그를 사용
			css의 list-style-type을 사용해서 글머리 유형 지정 (circle, disc, square) 
		-->
		<hr />
		<h3>ABOUT US</h3>
		<ol style="list-style-type: cjk-ideographic">
			<li>Company</li>
			<li>News</li>
			<li>Jobs</li>
			<li>Policies</li>
			<li>Contact</li>
		</ol>
		<h3>SOCIAL</h3>
		<ol style="list-style-type: upper-alpha">
			<li>Facebook</li>
			<li>Twitter</li>
			<li>Try our app</li>
		</ol>
		<h3>SERVICE</h3>
		<ol style="list-style-type: lower-roman">
			<li>FAQ</li>
			<li>Live support</li>
			<li>Site map</li>
		</ol>
		<!--
			ol : ordered list 순서있는 목록
			목록의 각 항목은 li태그를 사용
			css의 list-style-type을 사용해서 글머리 유형 지정 (deciaml, upper-roman, upper-alpha 등등...) 
		-->
		<!--
			목록을 나타낼때 ol, ul태그를 사용하지만 사이트의 메뉴를 표시할 때에도 사용함
		-->
		<hr />
		<h3>중첩목록</h3>
		<ol>
			<li>사과</li>
			<li>바나나</li>
			<li>오렌지</li>
			<ol>
				<li>사과</li>
				<li>바나나</li>
				<li>오렌지</li>
			</ol>
		</ol>
		<ul>
			<li>사과</li>
			<li>바나나</li>
			<li>오렌지</li>
			<ul>
				<li>사과</li>
				<li>바나나</li>
				<li>오렌지</li>
			</ul>
		</ul>
		<!--
			li요소 내에 또 다른 목록을 배치하여 하위 목록이나 중첩 목록을 만들 수 있음
			브라우저에서는 들여쓰기가 추가되고 번호/머릿글 유형이 바뀜
		-->
	</body>
</html>